<script>

import KtIcon from "/src/components/node-kantboot/components/KtIcon/KtIcon.vue";
import UserAccountIn from "/src/views/manage/iot/project/components/UserAccountIn.vue";

export default {
  components: {UserAccountIn, KtIcon},
  data() {
    return {
      show: false,
      project:{},
      requestParam:{
        email:""
      },
      userAccount:{
        id:null
      }
    }
  },
  methods: {
    open(item) {
      this.project = item;
      this.show = true;
    },
    close() {
      this.show = false;
    },
    search(){
      // 检测邮箱是否为空
      if (!this.requestParam.email) {
        this.$message.error(this.$i18n.zhToGlobal('邮箱不能为空'));
        return;
      }
      // 邮箱正则
      if (!/^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/.test(this.requestParam.email)) {
        this.$message.error(this.$i18n.zhToGlobal('邮箱格式不正确'));
        return;
      }

      this.$kt.request.send({
        uri: "/user-account-web/admin/userAccount/getByEmail",
        data: {
          email: this.requestParam.email
        },
        stateSuccess: (res) => {
          console.log(res)
          this.userAccount = res.data;
        },
        stateFail: (err) => {
          this.$message.error(err.errMsg);
          this.userAccount = {
            id:null
          };
        }
      });
    },
    save(){
      // /business-iot-web/admin/projectUserAccount/save
      this.$kt.request.send({
        uri: "/business-iot-web/admin/projectUserAccount/save",
        data: {
          projectId: this.project.id,
          userAccountId: this.userAccount.id
        },
        stateSuccess: (res) => {
          this.$emit("save");
          this.close();
        },
        stateFail: (err) => {
          this.$message.error(err.errMsg);
        }
      });
    },
  },
  mounted() {
  }
}

</script>

<template>
<el-dialog
  draggable
  width="300px"
  :title="$i18n.zhToGlobal('添加用户')+' - '+project?.title"
  v-model="show"
  @close="close">
  <div>
    <div>
      <div style="width: calc(100% - 70px);display: inline-block;">
        <el-input
            @keyup.enter.native="search()"
            v-model="requestParam.email"
            :placeholder="$i18n.zhToGlobal('根据邮箱搜索')"></el-input>
      </div>

      <div style="width: 60px;margin-left: 10px;float: right;display: inline-block;">
        <el-button
            @click="search"
            type="primary"
        >
          <kt-icon
              icon="el-icon-search"
          ></kt-icon>
        </el-button>
      </div>
    </div>
    <div>
      <div v-if="!userAccount.id"
      class="no-user"
      >
        <div style="height: 30px"></div>
        <div>{{$i18n.zhToGlobal('用户为空')}}</div>
        <div style="height: 30px"></div>
      </div>
      <div v-else>
        <div style="height: 20px"></div>
        <user-account-in
          :user-account="userAccount"></user-account-in>
      </div>
    </div>
    <div style="height: 10px"></div>
    <div>
      <el-button
          v-if="userAccount.id"
          type="primary"
                 style="width: 100%"
                 @click="save()">
        {{$i18n.zhToGlobal('确定')}}
        </el-button>
    </div>
  </div>
</el-dialog>
</template>

<style scoped lang="scss">
.no-user{
  text-align: center;
  color: #999;
  height: 50px;
}
</style>